<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>登录</title>
    <!-- 样 式 文 件 -->
    <link rel="stylesheet" href="component/pear/css/pear.css"/>
    <link rel="stylesheet" href="admin/css/other/login.css"/>
    <link rel="stylesheet" href="component/captcha/css/verify.css"/>
</head>
<!-- 代 码 结 构 -->
<body background="admin/images/background.svg" style="background-size: cover;">
<div id="content"></div>

<form class="layui-form" name="frmMain" action="javascript:void(0);">
    <div class="layui-form-item">
        <img class="logo" src="admin/images/logo.png"/>
        <div class="title">快速开发平台</div>
        <div class="desc">
            时间是衡量事业的标准
        </div>
    </div>
    <div class="layui-form-item">
        <input placeholder="账 户" hover class="layui-input" name="username" value="admin"/>
    </div>
    <div class="layui-form-item">
        <input placeholder="密 码" type="password" hover class="layui-input" name="password" value="123"/>
    </div>
    <!--			<div class="layui-form-item">-->
    <!--				<input placeholder="验证码 : "  hover  lay-verify="required" class="code layui-input layui-input-inline"  />-->
    <!--				<img src="admin/images/captcha.gif" class="codeImage" />-->
    <!--			</div>-->
    <div class="layui-form-item">
        <button type="button" class="pear-btn pear-btn-success login" id="login">
            登 入
        </button>
    </div>

</form>
<!-- 资 源 引 入 -->
<script src="component/layui/layui.js"></script>
<script src="component/pear/pear.js"></script>
<script src="config/apiUrl.js"></script>
<!--验证码-->
<script src="component/captcha/js/jquery.min.js"></script>
<script src="component/captcha/js/crypto-js.js"></script>
<script src="component/captcha/js/ase.js"></script>
<script src="component/captcha/js/verify.js "></script>
<script>
    layui.use(['form', 'button', 'popup', 'http', 'toast', 'context', 'jquery'], function () {
        var form = layui.form;
        var button = layui.button;
        var http = layui.http;
        var toast = layui.toast;
        var $ = layui.jquery;

        http.appPath = "/service-adminManage/outhtml/login.html";
        //绑定回车
        $(document).keydown(function (e) {
            if (e.keyCode == 13) {
                $("#login").click();
            }
        })
        $('#content').slideVerify({
            baseUrl: apiUrlConfig.captchaGet,  //服务器请求地址, 默认地址为安吉服务器;
            containerId: 'login',//pop模式 必填 被点击之后出现行为验证码的元素id
            mode: 'pop',     //展示模式
            imgSize: {       //图片的大小对象,有默认值{ width: '310px',height: '155px'},可省略
                width: '400px',
                height: '200px',
            },
            barSize: {          //下方滑块的大小对象,有默认值{ width: '310px',height: '50px'},可省略
                width: '400px',
                height: '40px',
            },
            beforeCheck: function () {  //检验参数合法性的函数  mode ="pop"有效
                let flag = true;
                //实现: 参数合法性的判断逻辑, 返回一个boolean值
                if (frmMain.username.value == "") {
                    toast.error({title: false, message: "请输入用账号"})
                    $("[name='username']").focus();
                    return false
                }
                if (frmMain.password.value == "") {
                    toast.error({title: false, message: "请输入用密码"})
                    $("[name='password']").focus();
                    return false
                }
                return flag
            },
            ready: function () {
            },  //加载完毕的回调
            success: function (params) { //成功的回调
                // params为返回的二次验证参数 需要在接下来的实现逻辑回传服务器
                //例如: login($.extend({}, params))
                var but = button.load({
                    elem: '.login',
                    time: 0
                })
                let postData = $.extend({}, params);
                postData.username = frmMain.username.value;
                postData.password = frmMain.password.value;
                http.ajax({
                    url: apiUrlConfig.user.login,
                    dataType: 'json',
                    type: 'POST',
                    data: JSON.stringify(postData),
                    contentType: "application/json",
                    success: function (result) {
                        toast.success({title: false, message: "认证成功"})
                        setTimeout(function () {
                            location.href = "user_index.html";
                        }, 1000);
                    },
                    error: function (jqXHR) {
                        but.stop(function () {

                        })
                    }
                });
            },
            error: function () {
                but.stop(function () {

                })
            }        //失败的回调
        });
    })
</script>
</body>
</html>
